import { configureStore } from '@reduxjs/toolkit';
import canvasSlice from '@/reducers/canvasSlice'
import toolSlice from '@/reducers/toolSlice'
import layerSlice from '@/reducers/layerSlice'
import menuSlice from '@/reducers/menuSlice';
import actionSlice from '@/reducers/actionSlice';
import { TypedUseSelectorHook, useDispatch, useSelector } from 'react-redux';

const store = configureStore({
  reducer: {
    [canvasSlice.name]: canvasSlice.reducer,
    [toolSlice.name]: toolSlice.reducer,
    [layerSlice.name]: layerSlice.reducer,
    [menuSlice.name]: menuSlice.reducer,
    [actionSlice.name]: actionSlice.reducer,
  },
  middleware: (getDefaultMiddleware) => getDefaultMiddleware({
    serializableCheck: false
  })
});

export type RootState = ReturnType<typeof store.getState>;
export type AppDispatch = typeof store.dispatch;
export type AppSelector = TypedUseSelectorHook<RootState>
export const useAppDispatch: () => AppDispatch = useDispatch;
export const useAppSelector: AppSelector = useSelector;


export default store